<div *ngIf="user" class="form-horizontal">
  <form #userform="ngForm" novalidate>
    <div class="row">
        <div class="form-group col-sm-6">
            <label class="form-control-label">ID:</label>
            <input name="user_id" [(ngModel)]="user.user_id" placeholder="用户ID" class="form-control"  readonly />
        </div>
        <div class="form-group col-sm-6">
            <label class="form-control-label">姓名:</label>
            <input name="user_name" [(ngModel)]="user.user_name" placeholder="姓名" class="form-control" required />
        </div>
    </div>
    <div class="row">
        <div class="form-group col-sm-6">
            <label class="form-control-label" for="user_mobile">电话:</label>
            <input  name="user_mobile" [(ngModel)]="user.user_mobile" placeholder="电话" class="form-control"
             #user_mobile="ngModel" required pattern="(\d{11})|^((\d{7,8})|(\d{4}|\d{3})-(\d{7,8})|(\d{4}|\d{3})-(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1})|(\d{7,8})-(\d{4}|\d{3}|\d{2}|\d{1}))$" />
            <span [hidden]="user_mobile.valid || user_mobile.pristine">
              电话号码不正确。
            </span>
        </div>
        <div class="form-group col-sm-6">
            <label for="user_email" class="form-control-label">邮箱:</label>
            <input  name="user_email" #user_email="ngModel" [(ngModel)]="user.user_email" placeholder="邮箱" class="form-control" required/>
        </div>
    </div>
    <div class="row">
        <div class="form-group col-sm-6">
            <label class="form-control-label" for="login_username">登录名:</label>
            <input  name="login_username" [(ngModel)]="user.login_username" placeholder="登录名" class="form-control" />
        </div>
        <div class="form-group col-sm-6">
            <label class="form-control-label" for="status">是否有效:</label>
            <select name="status" class="form-control" id="status" [(ngModel)]="user.status">
            <option>YES</option>
            <option>NO</option>
        </select>
        </div>
    </div>
    <div class="row">
      <div class="form-group col-sm-6">
        <label class="form-control-label" for="role_id">角色:</label>
        <select name="role_id" class="form-control"  required [(ngModel)]="user.role_id">
          <option *ngFor="let role of roles" [value]="role.role_id" >{{role.role_name}}</option>
        </select>
      </div>
      <div class="form-group col-sm-6" *ngIf="user.role_id == 2">
        <label class="form-control-label" for="carrier_id">承运商:</label>
        <select name="carrier_id" class="form-control" required [(ngModel)]="user.carrier_id">
          <option *ngFor="let carrier of carriers" [value]="carrier.carrier_id" >{{carrier.carrier_name}}</option>
        </select>
      </div>
    </div>
    <div class="row">
        <div class="form-group">
            <!--<div class="col-sm-1">
                <button class="btn btn-danger" *ngIf="user.user_id" (click)="delete()">禁用</button>
            </div>-->
            <div class="offset-sm-6 col-sm-1">
                <button class="btn btn-default" *ngIf="user.user_id" (click)="resetPassword()">重置密码
                <span *ngIf="user.password" class="label label-danger">{{user.password}}</span>
                </button>
            </div>
            <div class="offset-sm-2 col-sm-1">
                <button class="btn btn-default" (click)="cancel()">取消</button>
            </div>
            <div class="col-sm-1">
                <button [disabled]="!userform.form.valid" class="btn btn-primary" (click)="save()">保存</button>
            </div>
        </div>
    </div>

  </form>
</div>
